<%-- 
    Document   : reportevacaciones
    Created on : 19/07/2012, 02:25:30 PM
    Author     : Christian Alexander Morales Vargas (cmorales.corporacion@gmail.com)
--%>

<%@page contentType="text/html" pageEncoding="ISO-8859-1"%>
<%@ taglib uri="http://struts.apache.org/tags-html" prefix="html"%>
<%@ taglib uri="http://java.sun.com/jstl/core_rt" prefix="c" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jstl/fmt_rt" %>
<jsp:useBean id="hoy" class="java.util.Date" />
<!DOCTYPE html>
<html>
    <head>
       <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
       
       <link href="<%=request.getContextPath()%>/css/tab.css" rel="stylesheet" type="text/css"/>
        <link href="<%=request.getContextPath()%>/css/componentes.css" rel="stylesheet" type="text/css"/>
        <link href="<%=request.getContextPath()%>/css/miestilo.css" rel="stylesheet" type="text/css"/>
        <link href="<%=request.getContextPath()%>/css/tooltip.css" rel="stylesheet" type="text/css"/>

        <link rel="stylesheet" href="<%=request.getContextPath()%>/css/jquery/datePicker/jquery.ui.all.css"/>

        <script type="text/javascript" src="<%=request.getContextPath()%>/js/jquery/jquery.js"></script>
        <script language="javascript" type="text/javascript" src="<%=request.getContextPath()%>/js/jquery/jquery.format.1.04.js"></script>
        <script language="javascript" type="text/javascript" src="<%=request.getContextPath()%>/js/jquery/jquery-1.4.2.js"></script>
        <script language="javascript" type="text/javascript" src="<%=request.getContextPath()%>/js/jquery/datePicker/jquery.ui.core.js"></script>
        <script language="javascript" type="text/javascript" src="<%=request.getContextPath()%>/js/jquery/datePicker/jquery.ui.datepicker.js"></script>
        <script language="javascript" type="text/javascript" src="<%=request.getContextPath()%>/js/jquery/datePicker/jquery.ui.datepicker-es.js"></script>
        <script type="text/javascript" src="<%=request.getContextPath()%>/js/jquery/jquery.tablesorter.js"></script>
        <script type="text/javascript" src="<%=request.getContextPath()%>/js/jquery/jquery.tablesorter.pager.js"></script>
        <script type="text/javascript" src="<%=request.getContextPath()%>/js/util.js"></script>
        <script type="text/javascript" src="<%=request.getContextPath()%>/js/sgv/sgv.js"></script>
        <script type="text/javascript" src="<%=request.getContextPath()%>/js/sgv/miSolicitud.js"></script>
        <script type="text/javascript" src="<%=request.getContextPath()%>/js/sgv/bandejaAprobacion.js"></script>
        <script type="text/javascript" src="<%=request.getContextPath()%>/js/sgv/miEquipo.js"></script>
        <script type="text/javascript" src="<%=request.getContextPath()%>/js/sgv/vacacion.js"></script>

        <script language="javascript" type="text/javascript" src="<%=request.getContextPath()%>/js/jquery/jquery.ui.widget.js"></script>
        <script language="javascript" type="text/javascript" src="<%=request.getContextPath()%>/js/json2.js"></script>

        <link type="text/css" href="<%=request.getContextPath()%>/js/jquery-ui-1.8/css/hot-sneaks/jquery-ui-1.8.12.custom.css" rel="stylesheet" />
        <script type="text/javascript" src="<%=request.getContextPath()%>/js/jquery-ui-1.8/js/jquery-ui-1.8.12.custom.min.js"></script>
        <script type="text/javascript" src="<%=request.getContextPath()%>/js/collapse.js"></script>
        <title>JSP Page</title>
        <fmt:setLocale value="en-GB"/>
        <script type="text/javascript">
         
                   
            $(document).ready(function(){


                $("#btnEnviar").click(function(){
                    enviarSolicitud('./solicitud.do', 'tblSolicitudes');
                });

                $(function() {
                    $("#fechaInicioVacaciones").datepicker();
                    $("#fechaInicioVacaciones").datepicker($.datepicker.regional['es']);

                });

                $(function() {
                    $("#fechaFinVacaciones").datepicker();
                    $("#fechaFinVacaciones").datepicker($.datepicker.regional['es']);
                });

         
            });

           
        </script>
        <style>
            select { 
                border:1; 
                color:#EEE; 
                width:150px;
                }
                th{
                    color: white;
                    font-size: 11px;
                    font-family:arial;
                    font-weight: bold;
                }   
                td{
                    color: black;
                    font-size: 12px;
                    font-family:arial;
                    font-weight: bold;
                } 
                #cuerpo{
                    background: #eeeeee;
                }
        </style>
    </head>
    <body>
        <table border="0" style="width: 60%; margin-left: 20%;">
            <tbody>
                <tr>
                    <td>Sociedad</td>
                    <td>
                        <select name="combo" class="selecto">
                            <option></option>
                            <option></option>
                        </select>
                    </td>
                    <td></td>
                    <td></td>
                    <td></td>
                </tr>
                <tr>
                    <td>Divisi&oacute;n</td>
                    <td>
                        <select name="combo" class="selecto">
                            <option></option>
                            <option></option>
                        </select>
                    </td>
                    <td>Sub Divisi&oacute;n</td>
                    <td>
                        <select name="combo" class="selecto">
                            <option></option>
                            <option></option>
                        </select>
                    </td>
                    <td></td>
                </tr>
                <tr>
                    <td>Colaborador</td>
                    <td>
                        <input type="text" name="" value="" />
                    </td>
                    <td>Aprobador</td>
                    <td>
                        <input type="text" name="" value="" />
                    </td>
                    <td></td>
                </tr>
                <tr>
                    <td>Fec. Inicio</td>
                    <td>
                        <input style="text-align: center" onchange="dias(document.getElementById('fechaInicioVacaciones').value, document.getElementById('fechaFinVacaciones').value)" size="8" name="fechaInicio" type="text" class="labelCampos" id="fechaInicioVacaciones" readonly="true" value="<fmt:formatDate value="${hoy}" pattern="dd/MM/yyyy" />"
                    </td>
                    <td>Fec. Fin</td>
                    <td>
                        <input style="text-align: center" class="labelCampos" onchange="dias(document.getElementById('fechaInicioVacaciones').value, document.getElementById('fechaFinVacaciones').value)" name="fechaFin" type="text" id="fechaFinVacaciones" readonly="true" size="8" value="<fmt:formatDate value="${hoy}" pattern="dd/MM/yyyy" />"
                    </td>
                    <td>
                           <button ><img src="<%=request.getContextPath()%>/images/iconos/ejecutar.gif" alt="" height="15px"/> &nbsp;Ejecutar</button> 
                    </td>
                </tr>
            </tbody>
        </table>

        <br>
        <table border="0" style="width: 100%;">
            <thead>
                <tr style="background: #1f497d; ">
                    <th style="width: 15%;">Nombre Colaborador</th>
                    <th style="width: 15%;">Puesto del colaborador</th>
                    <th style="width: 15%;">Nombre del Aprobador</th>
                    <th style="width: 15%;">Puesto del Aprobador</th>
                    <th style="width: 15%;">&Aacute;rea</th>
                    <th style="width: 12.5%;">Fec. Inicio</th>
                    <th style="width: 12.5%;">Fec. Fin</th>
                </tr>
            </thead>
            <tbody id="cuerpo">
                <tr>
                    <th></th>
                    <th colspan="6" class="label" style="color: black; float: left;"><label style="margin-left: 300px;"> No tiene registros</label></th>


                </tr>
            </tbody>
        </table>

        <br><br>
        <table border="0" style="width: 100%;">
            
            <tbody>
                <tr>
                    <td style="width: 50%;"></td>
                    <td style="width: 25%;"><button type="button"  style="width: 85px;"><img src="<%=request.getContextPath()%>/images/iconos/printer.png" alt="" height="15px"/> &nbsp;Imprimir</button> <button type="button"  style="width: 85px;"><img src="<%=request.getContextPath()%>/images/iconos/excel.png" alt="" height="15px"/> &nbsp;Excel</button> </td>
                    <td style="width: 25%;"></td>
                </tr>
                
            </tbody>
        </table>            
    </body>
</html>
